const orderpage={
    name:'orderpage',
    template:`
        <div class="table-responsive">
            <table class="table table-striped table-sm table-hover">
                <thead>
                    <tr>
                        <th scope="col">行号</th>
                        <th scope="col">ID</th>
                        <th scope="col">名称</th>
                        <th scope="col">电话</th>
                        <th scope="col">购买日期</th>
                        <th scope="col">购买电话数量</th>
                        <th scope="col">最近购买日期</th>
                        <th scope="col">用户购卡顺序</th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="(o, i) in list" :key="o.id">
                        <td :class="{ 'bg-success': o.isOnline }">
                            {{ (currentPageNo-1)*pageSize + (i+1) }}
                        </td>
                        <td>{{ o.id }}</td>
                        <td>{{ o.username }}</td>
                        <td>{{ o.tel }}</td>
                        <td>{{ o.create_time }}</td>
                        <td>{{ o.phonenum }}</td>
                        <td>{{ o.minbuydate }}</td>
                        <td>{{ o.rowNum }}</td>
                    </tr>
                </tbody>
            </table>
            <page :page-size="pageSize" :data-count="dataCount" @pagechange="mypagechange"></page>
        </div>
    `,
    data(){
      return {
            list: [],
			pageSize:2,//此处设置每页显示几行
			dataCount:0,
			currentPageNo:1
      }
    },
    mounted: function () {
		this.mypagechange(1,this.pageSize);
	},
    methods: {
		queryAll() {
			$http.get('/userTel/queryAll').then(res => {
				this.list = res;
			})
		},
		mypagechange(currentPageNo, pageSize){
			//后台请求数据
			$http.get('/userTel/queryByPageUserTel?pageSize='+ pageSize + '&currentPageNo=' + currentPageNo).then(res => {
				this.list = res.data;
				this.currentPageNo = currentPageNo;
				this.dataCount = parseInt(res.count);
			})
		}

	}
  }



export {orderpage}